import React,{Component} from 'react';

class Child extends Component{
    constructor(props){
        super(props);
    }
    render(){
        console.log("zi--render")
        return <div>
            <h1>子组件的==={this.props.title}</h1>
        </div>
    }

    componentWillReceiveProps(nextProps) {
        console.log('zi----componentWillReceiveProps',nextProps)
    }

    shouldComponentUpdate(nextProps, nextState) {
        console.log("====",nextProps)
        // return true  //更新
        return this.props.title !== nextProps.title
    }

    componentWillUpdate(){
        console.log("zi---componentWillUpdate")
    }
    componentDidUpdate(){
        console.log('zi---componentDidUpdate')
    }

    componentWillUnmount(){
        console.log("zi---componentWillUnmount")
    }
}


export default class Car extends Component{
    constructor(props){
        console.log('constructor')
        super(props);
        this.state = {
            title:'car',
            flag:true
        }
    }

    componentWillMount(){
        console.log('componentWillMount')
    }
    
    render(){
        console.log('render');
        return <div> 
            {this.state.title}
            <button onClick={this.changeTitle}>change title</button>
            {this.state.flag ? <Child title={this.state.title}></Child> : null}
            <button onClick={this.changeShow}>创建/销毁</button>
        </div>
    }

    changeShow = () => {
        this.setState({
            flag:false
        })
    }

    changeTitle = () => {
        this.setState({
            title:'车'
        })
    }

    componentDidMount(){
        console.log('componentDidMount')
    }

    
    componentWillReceiveProps(nextProps) {
        console.log('componentWillReceiveProps')
    }
    
    
    shouldComponentUpdate(nextProps, nextState) {
        console.log("父--shouldComponentUpdate");
        return true
    }

    componentWillUpdate(){
        console.log("父---componentWillUpdate")
    }
    componentDidUpdate(){
        console.log('父---componentDidUpdate')
    }
    
}